<template>
    <!-- 危险源清单项添加 -->
    <base-modal
        :title="initData.pageType === 'edit' ? '编辑危险源清单项' : ' 添加危险源清单项'"
        cancelText="取消"
        okText="保存"
        :visible="visible"
        :width="900"
        v-on="$listeners"
        @ok="handleOk"
        :confirmLoading="loading.isSaving"
    >
        <a-form-model
            ref="form"
            :model="formInfo"
            :rules="rules"
            :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }"
            :wrapperCol="{ lg: { span: 18 }, sm: { span: 18 } }"
        >
            <a-row :gutter="24">
                <a-col :md="12" :sm="12">
                    <a-form-model-item label="分类" prop="type">
                        <a-select placeholder="请选择" v-model="formInfo.type">
                            <a-select-option
                                :disabled="!item.enabled"
                                v-for="item in selectList"
                                :key="item.id"
                                :value="item.id"
                                >{{ item.name }}</a-select-option
                            >
                        </a-select>
                    </a-form-model-item>
                </a-col>
                <a-col :md="12" :sm="12">
                    <a-form-model-item label="责任部门\人" prop="hazardsEmployees">
                        <SelectPersonByProject
                            mode="multiple"
                            :projectId="formInfo.projectId"
                            v-model="formInfo.hazardsEmployees"
                        />
                        <!-- <OrgStaffAsync
                            placeholder="请选择/多选"
                            v-model="formInfo.hazardsEmployees"
                            :orgCheckable="true"
                            :selectedValue.sync="formInfo.hazardsEmployees"
                            :treeCheckable="true"
                        /> -->
                        <!-- <OrgStaffAsync
                            placeholder="请选择/多选"
                            v-model="formInfo.hazardsEmployees"
                            :isLazyLoad="true"
                            :useSingle="true"
                            :selectedValue.sync="formInfo.hazardsEmployees"
                            :treeCheckable="true"
                        /> -->
                    </a-form-model-item>
                </a-col>
                <a-col :md="24" :sm="24">
                    <a-form-model-item label="危险源（风险点）" prop="dangerSource">
                        <BaseTextarea placeholder="请输入" v-model="formInfo.dangerSource" />
                    </a-form-model-item>
                </a-col>
                <a-col :md="24" :sm="24">
                    <a-form-model-item label="计划控制措施(具有操作性)" prop="measures">
                        <BaseTextarea placeholder="请输入" v-model="formInfo.measures" />
                    </a-form-model-item>
                </a-col>
                <a-col :md="24" :sm="24">
                    <a-form-model-item label="可能导致的事故：" prop="accident">
                        <BaseTextarea placeholder="请输入" v-model="formInfo.accident" />
                    </a-form-model-item>
                </a-col>
            </a-row>
        </a-form-model>
    </base-modal>
</template>

<script>
import { getSelectListByType } from '@/api/safetySupervision/common.js'
import SelectPersonByProject from '@/components/Select/SelectPersonByProject.vue'
import { updateHazard, addHazard, getHazardDetail } from '@/api/office/conference'
import BaseModal from '@/components/BaseModal'
import OrgStaffAsync from '@/components/TreeSelectOrganization/orgStaffAsync.vue'
export default {
    name:'a'+Date.now(),    components: {
        BaseModal,
        OrgStaffAsync,
        SelectPersonByProject,
    },
    props: {
        initData: {
            type: Object,
            default() {
                return {}
            },
        },
        visible: {
            type: Boolean,
            default: false,
        },
    },
    data() {
        return {
            loading: {
                isSaving: false,
            },
            formInfo: {},
            selectList: [],

            rules: {
                dangerSource: [{ required: true, message: '请输入', trigger: 'change' }],
                measures: [{ required: true, message: '请输入', trigger: 'change' }],
                accident: [{ required: true, message: '请输入', trigger: 'change' }],
                type: [{ required: true, message: '请选择', trigger: 'change' }],
                hazardsEmployees: [{ required: true, message: '请选择', trigger: 'change' }],
            },
        }
    },
    created() {},
    watch: {
        visible(v) {
            if (v) {
                this.$nextTick(() => {
                    this.formInfo = this.initData
                    console.log(this.formInfo)
                    this.getSelectListByType(17)
                })
            } else {
                // this.formInfo = {}
            }
        },
    },
    methods: {
        async getSelectListByType(type) {
            const [err, res] = await getSelectListByType({ type })
            if (!err) {
                this.selectList = res.data || []
            }
        },

        validateForm() {
            let flag = false
            this.$refs.form.validate((valid) => {
                flag = valid
              if(!valid) {
                this.$message.warning("请填写完所有必填项信息")
              }
            })
            return flag
        },
        // handleClose(){
        //     this.$emit('confirm', this.formInfo)
        // }
        async handleOk() {
            if (!this.validateForm()) return
            this.loading.isSaving = true

            const { pageType } = this.initData
            delete this.formInfo.hazardsEmployeesName
            // const hazardsEmployees =  this.this.formInfo.hazardsEmployees;
            // this.formInfo.hazardsEmployees= [];
            // this.formInfo.hazardsEmployees.push(hazardsEmployees)
            this.formInfo = { ...this.formInfo, meetingId: this.initData.meetingId }

            const fn = pageType === 'edit' ? updateHazard : addHazard
            const [err, res] = await fn(this.formInfo)
            if (!err) {
                this.$message.success('成功')
                this.$emit('confirm')
            }
            this.loading.isSaving = false
        },
    },
}
</script>

<style lang="less" scoped>
form .ant-mentions,
form textarea.ant-input {
    height: auto !important;
    width: 100%;
}
</style>
